<template>
  <div class="pile-detail">
    <Head title="电桩信息" isBack>
      <template #content>
        <Detail
          :columns="3"
          :form="data.detailForm1"
          :detail="data.detailData"
          align="right"
        ></Detail>
      </template>
    </Head>
    <Head title="终端信息">
      <template #content>
        <Detail
          :columns="3"
          :form="data.detailForm2"
          :detail="data.detailData"
          align="right"
        ></Detail>
      </template>
    </Head>
    <Head title="充电桩修改信息">
      <template #content>
        <Detail
          :columns="2"
          :form="data.detailForm3"
          :detail="data.detailData"
          align="right"
        ></Detail>
      </template>
    </Head>
    <Head title="充电单价">
      <template #content>
        <Table
          ref="tableRef"
          :columns="data.columns"
          :list="data.priceList"
          :isPagination="false"
          :isPost="false"
        ></Table>
      </template>
    </Head>
  </div>
</template>

<script lang="ts" setup>
import Head from '@/components/head/index.vue';
import Detail from '@/components/form/detail.vue';
import Table from '@/components/table/index.vue';
import { STATION_STATUS_USE, PILE_SIM } from '@/utils/dictionaries';
import { queryConnector } from '@/service/apis/pile';
import { queryDicByParent } from '@/service/apis/api';
import { getUdp, getTcp } from '../components/price';
import { number } from 'echarts/core';

const route = useRoute();
const {
  query: { id },
} = route;
const tableRef = ref();

queryDicByParent({
  listDtos: [
    'equipmentModelType',
    'communicationOperator',
    'protocolVersion',
    'networkLinkType',
    'operatorProperties',
  ],
}).then((res: any) => {
  if (res) {
    console.log('ddd--', res);
    data.detailForm1[1].dic = [...res.equipmentModelType];
    data.detailForm2[5].dic = [...res.operatorProperties];
    data.detailForm2[7].dic = [...res.protocolVersion];
    data.detailForm2[8].dic = [...res.communicationOperator];
    data.detailForm2[9].dic = [...res.networkLinkType];
  }
});

queryConnector({ id: id }).then((res: any) => {
  if (res) {
    data.detailData = res;

    const obj = data.detailData.costTemplateList.find(
      (item: any) => item.protocolVersion === data.detailData.version
    );
    if (obj) {
      data.priceList =
        obj.protocolVersion === '1'
          ? getUdp(obj.costTemplateUdpList)
          : getTcp(
              obj.costTemplateTcpPriceSetList,
              obj.costTemplateTcpPriceTypeList
            );
      console.log('lll----', data.priceList);
    }
  }
});

const data = reactive({
  detailData: {} as any,
  detailForm1: [
    {
      label: '电桩编码',
      prop: 'equipmentCode',
    },
    {
      label: '电桩类型',
      prop: 'type',
      dic: [] as any,
      type: Number,
    },
    {
      label: '品牌型号',
      prop: 'equipmentBrandName',
      template: (row: any) => {
        if (row.equipmentBrandName && row.equipmentModelName) {
          return `${row.equipmentBrandName}/${row.equipmentModelName}`;
        }
        return '--';
      },
    },
    {
      label: '电桩国标',
      prop: 'equipmentStandardName',
    },
    {
      label: '电桩功率',
      prop: 'power',
      unit: 'kW',
    },
    {
      label: '辅助电源支持',
      prop: 'supPower',
      unit: 'V',
    },
    {
      label: '输入电压',
      prop: 'inputv',
      unit: 'V',
    },
    {
      label: '最大电压',
      prop: 'maxv',
      unit: 'V',
    },
    {
      label: '最小电压',
      prop: 'minv',
      unit: 'V',
    },
    {
      label: '最大电流',
      prop: 'maxa',
      unit: 'A',
    },
    {
      label: '最小电流',
      prop: 'mina',
      unit: 'A',
    },
    {
      label: '恒功率输出电压区间',
      prop: 'minp',
      template: (row: any) => {
        if (row.minp && row.maxp) {
          return `${row.minp}~${row.maxp}V`;
        }
        return '--';
      },
    },
  ],
  detailForm2: [
    {
      label: '终端编码',
      prop: 'connectorCode',
    },
    {
      label: '终端名称',
      prop: 'connectorName',
    },
    {
      label: '启停状态',
      prop: 'isEnableStart',
      dic: STATION_STATUS_USE,
    },
    {
      label: '工作状态',
      prop: 'workStatusName',
    },
    {
      label: '归属电站',
      prop: 'stationName',
    },
    {
      label: '电站属性',
      prop: 'operatorAttr',
      dic: [] as any,
    },
    {
      label: '投运时间',
      prop: 'operationDate',
    },
    {
      label: '协议版本',
      prop: 'version',
      dic: [] as any,
    },
    {
      label: '通讯运营商',
      prop: 'communicationOperator',
      dic: [] as any,
    },
    {
      label: '网络链接类型',
      prop: 'communicationType',
      dic: [] as any,
      type: Number,
    },
    {
      label: 'SIM卡号',
      prop: 'numberSim',
    },
    {
      label: '设备生产日期',
      prop: 'productionDate',
    },
    {
      label: '车位号',
      prop: 'parkNo',
    },
    {
      label: '有无地锁',
      prop: 'parkLock',
      dic: PILE_SIM,
    },
    {
      label: '充电枪二维码',
      prop: 'qrCode',
      type: 'image',
    },
  ],
  detailForm3: [
    {
      label: '创建人',
      prop: 'createBy',
    },
    {
      label: '创建时间',
      prop: 'createTime',
    },
    {
      label: '修改人',
      prop: 'updateBy',
    },
    {
      label: '修改时间',
      prop: 'updateTime',
    },
  ],
  columns: [
    {
      prop: 'time',
      label: '时段',
    },
    {
      prop: 'pricePower',
      label: '电费（元/度）',
    },
    {
      prop: 'priceService',
      label: '服务费（元/度）',
    },
  ],
  priceList: [] as any,
});

const getData = (page: any) => {
  nextTick(() => {});
};
</script>